<template>
  <section class="index-notice">
    <div v-if="type == 2">
      <div class="title">
        <div class="title-left">
          <span> 客户回款提醒 </span>
        </div>
        <div class="title-right">
          <el-radio-group v-model="radio1" size="small" @change="change1Fun">
            <el-radio-button :label="1">今日</el-radio-button>
            <el-radio-button :label="2">3日内</el-radio-button>
            <el-radio-button :label="3">7日内</el-radio-button>
            <el-radio-button :label="4">1月内</el-radio-button>
          </el-radio-group>
        </div>
      </div>
      <el-table :data="schdlPlansInfo" style="width: 100%" stripe>
        <el-table-column prop="code" label="计划编号" />
        <el-table-column prop="order_no" label="订单编号" />
        <el-table-column prop="order_name" label="订单名称" />
        <el-table-column prop="amount_real" label="订单金额" />
        <el-table-column prop="num" label="计划期次" />
        <el-table-column prop="customer_name" label="客户名" />
        <el-table-column prop="plan_money" label="计划金额" />
        <el-table-column prop="plan_date" label="计划时间" />
      </el-table>
    </div>
    <!--  -->
    <div v-if="type == 1">
      <div class="title">
        <div class="title-left">
          <span> 客户跟进提醒 </span>
        </div>
        <div class="title-right">
          <el-radio-group v-model="radio2" size="small" @change="change2Fun">
            <el-radio-button :label="1">今日</el-radio-button>
            <el-radio-button :label="2">3日内</el-radio-button>
            <el-radio-button :label="3">7日内</el-radio-button>
            <el-radio-button :label="4">1月内</el-radio-button>
          </el-radio-group>
        </div>
      </div>
      <el-table :data="schdlFollowUpInfo" style="width: 100%" stripe>
        <el-table-column prop="created_user" label="创建人名称" />
        <el-table-column prop="opportunity_id" label="跟进商机id" />
        <el-table-column prop="communication" label="沟通形式" />
        <el-table-column prop="created_at" label="跟进具体时间" />
        <el-table-column prop="next_time" label="下次跟进计划时间" />
        <el-table-column prop="content" label="跟进情况描述" />
        <el-table-column prop="plan" label="下步计划" />
        <el-table-column prop="question" label="遇到问题" />
        <el-table-column prop="customer_name" label="客户名" />
        <el-table-column prop="address" label="地址" />
        <el-table-column prop="oppo_name" label="商机名" />
      </el-table>
    </div>

    <el-button type="primary" round class="btn" @click="router.back()">
      <el-icon>
        <IEpBack />
      </el-icon>
      返回上一页
    </el-button>
  </section>
</template>
<script setup>
import { schdlPlansApi, schdlFollowUpApi } from "@/plugins/api/home";
const router = useRouter();
const route = useRoute();
// 客户回款提醒
let radio1 = ref("1");
function change1Fun() {
  getSchdlPlans();
}
let schdlPlansInfo = ref([]);
function getSchdlPlans() {
  schdlPlansApi({
    dayLimit: radio1.value,
  }).then((data) => {
    schdlPlansInfo.value = [...data];
  });
}

// 客户跟进提醒
let radio2 = ref("1");
function change2Fun() {
  getSchdlFollowUp();
}
let schdlFollowUpInfo = ref([]);
function getSchdlFollowUp() {
  schdlFollowUpApi({
    dayLimit: radio2.value,
  }).then((data) => {
    schdlFollowUpInfo.value = [...data];
  });
}
let type = ref(22);
onMounted(() => {
  if (route.query.type) {
    type.value = route.query.type;
  }
  getSchdlPlans();
  getSchdlFollowUp();
});
</script>
<style scoped lang="scss">
.index-notice {
  .title {
    width: 100%;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #aaa6a699;
    line-height: 40px;

    .title-left {
      align-self: center;
      margin-left: 10px;

      span {
        font-size: 18px;
        font-weight: 600;
      }
    }

    .title-right {
      align-self: center;
      margin-right: 10px;

      span {
        font-size: 12px;
        color: #676b80;
        cursor: pointer;
      }
    }
  }

  .btn {
    margin-top: 20px;
  }
}
</style>
